<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>复选框的全选和取消全选</title>
</head>
<body>
    <!--引入jq文件-->
    <script type="text/javascript" src="js/jquery-3.4.1.js"></script>

    <script type="text/javascript">
        function selectAll() {

            //1，获得第一个checkbox的选中状态
            var flag = $("#selectAll").prop("checked");

            //2，为所有数据行checkbox设置选中状态
            $(".interest").prop("checked",flag);

        }
    </script>
    <input type="checkbox" id="selectAll" onclick="selectAll()">全选<br>
    <input type="checkbox" class="interest" value="smoke">抽烟<br>
    <input type="checkbox" class="interest" value="drink">喝酒<br>
    <input type="checkbox" class="interest" value="tt">烫头<br>
</body>
</html>